import {View, Button, Text, Image, ScrollView, Radio} from '@tarojs/components';
import Taro from '@tarojs/taro';
import React, {Component} from 'react';
import * as T from '../types';
import './rechargeNavBar.less';
import actions from '../actions/index';
import {connect} from 'react-redux';
import {store2Props} from '../selectors';
import iplandMoney from '../image/ipland_money.png';
import {AtIcon} from 'taro-ui';
import 'taro-ui/dist/style/components/icon.scss';
type ITopProps = T.IProps & T.ITopProps;
//@ts-ignore
@connect<Partial<ITopProps>, T.ITopState>(store2Props, actions)
export default class Info extends Component<Partial<ITopProps>, T.ITopState> {
  constructor(props: ITopProps) {
    super(props);
    this.state = {};
  }

  render() {
    let {
      main: {money},
    } = this.props;
    return (
      <View className="rechargeNavBar">
        <View style={{flexDirection: 'row', alignItems: 'baseline'}}>
          <Text className="text1">金币余额</Text>
          <Text className="text2">{money || '0'}</Text>
        </View>
        <Image className="rechargeNavBar-moneyIcon" src={iplandMoney}></Image>
        <View
          className="text3"
          onClick={() => {
            Taro.navigateTo({
              url: '/pages/package-I/syntheticRechargeHistory/index',
            });
          }}
        >
          明细
          <AtIcon onClick={() => {}} customStyle={{zIndex: 2}} value="chevron-right" size="10" color="#fff"></AtIcon>
        </View>
      </View>
    );
  }
}
